<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>手术（手术记录）</title>
<script type="text/javascript" src="static/easyui/jquery.min.js"></script>
<script type="text/javascript" src="static/easyui/jquery.easyui.min.js"></script>
<script type="text/javascript" src="static/easyui/locale/easyui-lang-zh_CN.js"></script>
<link rel="stylesheet" href="static/easyui/themes/metro/easyui.css"/>
<link rel="stylesheet" href="static/easyui/themes/icon.css"/>
</head>
<body>
	<script type="text/javascript">
	
	//进行手术的按钮
	function startoparation(operation_id,clinic_name,hosp_id,oparrange_money,operationtype_name){
		$("#oper-opsing-win").window("open");
		//赋值给住院号
		$("#opshospid").textbox('setValue',hosp_id);
		$("#opshospid").textbox('textbox').attr('readonly',true);  
		$("#opsmoney_input").textbox('setValue',oparrange_money);
		$("#oid").textbox('setValue',operation_id);
		//赋值给病人
		$("#sname").textbox('setValue',clinic_name);
		$("#opsprojectname").textbox('setValue',operationtype_name);
		//只能读不能编辑
		$("#oid").textbox('textbox').attr('readonly',true);  
		$("#sname").textbox('textbox').attr('readonly',true);
		
	};
	
	//点击禁用按钮，使这一行数据不能编辑且颜色变灰
	function forbiden(operation_id,oparrange_money,hosp_id){
		if(oparrange_money == 0){
			$.messager.confirm('Confirm', 
					'此安排已取消', 
					function(r){
			});
		}
		$.ajax({
            url:"update-arrange",
            type:"Post",
            data:{'operation_id':operation_id,'oparrange_money':oparrange_money,'hosp_id':hosp_id},
            dataType:"json",
            success:function(data) {
            	$.messager.show({
                    title:'提示信息' , 
                    msg:'安排手术的记录已取消成功!'
                });	    
			    $("#ops-record").datagrid('reload'); 
             }
        });
	};
	
	
		$(function(){
			
			//手术进行中的确定按钮
			$("#opsing-comfirm").click(function(){
				$('#opsing-for').form({
				    url:'add-opsingrecord',
				    onSubmit: function(){ 
				    	if(!$('#opsing-for').form('validate')){//调用validate方法校验
                            $.messager.show({
                                title:'提示信息' , 
                                msg:'验证没有通过,不能提交表单!'
                            });
                            return false ;        //当表单验证不通过的时候 必须要return false 
                        }
				    },
				    success:function(data){
				    	$('#opsing-for').form("clear");//清空文本
				    	$("#ops-record").datagrid('reload');
				    	//手术记录刷新
				    	$("#opsing-record").datagrid('reload');
						$("#oper-opsing-win").window("colse");
						$.messager.show({
                            title:'提示信息' , 
                            msg:'手术新增成功!,请及时查看结果'
                        });
				    }
				}).submit();
			});
			
			$("#ops-record").datagrid({
				rowStyler: function(index,row){
					if(row.oparrange_state==-1){
						 return "background-color:#ddd;";
					}
	               
	            }
		    }); 
			
			//手术安排记录
			$("#ops-record").datagrid({
			    url:'init-arrangerecord',
			    onLoadSuccess: function (data) { 
					if(data==null||data.total ==0){
						$(this).datagrid('appendRow',{
							operation_id:'<div style="height:30px;font-size:18px;text-align:center;color:red;line-height:30px;">没有相关记录！</div>',
									rownumbers : false
							//合并单元格
						}).datagrid('mergeCells',{
									index : 0,
									field : 'operation_id',
									colspan : 12
						})
						//隐藏分页导航条
						$(this).closest('div.datagrid-wrap').find('div.datagrid-pager').hide();
					}else{
						$(this).closest('div.datagrid-wrap').find('div.datagrid-pager').show();
					}
					
					$('.a').linkbutton({
				        	text:'进行手术',
				        	plain:true,
				        	iconCls:'icon-edit'
				        }); 
			        $('.aa').linkbutton({
			        	text:'进行手术',
			        	plain:true,
			        	iconCls:'icon-edit',
			        	disabled:true
			        }); 
			        $('.cannel').linkbutton({
			        	text:'取消安排',
			        	plain:true,
			        	iconCls:'icon-close'
			        }); 
	
				}, 
			    singleSelect:true,
			    pagination:true,
      		    pageNumber:1,
      		    pageSize:3,
      		    pageList:[3,6],
			    columns:[[
					{field:'operation_id',title:'安排号',width:60},
					{field:'hosp_id',title:'住院号',width:80,hidden:true},
					{field:'clinic_name',title:'病人姓名',width:70},
					{field:'clinic_sex',title:'性别',width:50},
					{field:'user_name',title:'医生名字',width:100},
					{field:'nursename',title:'医生助手',width:100},
					{field:'operationroom_name',title:'手术室',width:115},
					{field:'operationtype_name',title:'手术类型',width:115},
					{field:'oparrange_money',title:'手术预估金额',width:90,
						formatter:function(value,row,index){
							 return value+"  元";
	   					},
						styler: function(value,row,index){
							return 'color:red;font-weight:bold;';
					    }
					},
					{field:'operation_reason',title:'手术原因',width:95},
					{field:'oparrange_date',title:'安排时间',width:100},
					{field:'oparrange_state',title:'状态',width:100,hidden:true},
					{field:'ops',title:'操作',width:140,
						formatter: function (value, row, index) {
							console.log(row.oparrange_state);
							if(row.oparrange_state==0){
								var str = "";
				                str += '<span><a href="#" class="a easyui-linkbutton" onclick="startoparation(\'' + row.operation_id +'\',\'' + row.clinic_name +'\',\'' + row.hosp_id +'\',\''+row.oparrange_money+'\',\''+row.operationtype_name+'\')">进行手术</a></span><br/><br/>';
				                str += '<span><a href="#" class="cannel easyui-linkbutton" style="text-decoration: none;color:blue;" onclick="forbiden(\'' + row.operation_id +'\',\'' + row.oparrange_money +'\',\''+row.hosp_id+'\')">取消安排</a></span>';
				                return str;
							}else if(row.oparrange_state==-1){
								var str = "";
				                str += '<span><a href="#" class="aa easyui-linkbutton" iconCls:"icon-edit" onclick="startoparation(\'' + row.operation_id +'\',\'' + row.clinic_name +'\',\'' + row.hosp_id +'\',\''+row.oparrange_money+'\',\''+row.operationtype_name+'\')">进行手术</a></span><br/><br/>';
				                str += '<span><a href="#" class="cannel easyui-linkbutton" style="text-decoration: none;color:blue;" onclick="forbiden(\'' + row.operation_id +'\',\'' + row.oparrange_money +'\',\''+row.hosp_id+'\')">取消安排</a></span>';
				                return str;
							}else if(row.oparrange_state==1){
								return "已执行的安排";
							}
			                
			            },
			            styler: function(value,row,index){
							if(row.oparrange_state==1){
								return 'color:#AA33B6;font-weight:bold;';
							}
							
					    }
	
					}
			    ]]
			});

			//新增手术项目
			$("#addopstype").click(function(){
				$("#ops-record-update-win").window("open");
			});
			
			
			
			//查看手术项目
			$("#lookopstype").click(function(){
				$("#opstype-win").window("open");
			});
			

			//新增手术类型的确定按钮
			$("#addtype-comfrim").click(function(){
				$("#addtype-form").form({
					url:'add-opreationtype',
				    onSubmit: function(){
				    },
				    success:function(data){
				    	//$("#opstype-tab").datagrid('reload');
				    	$.messager.show({
                            title:'提示信息' , 
                            msg:'手术项目新增成功!,请及时查看结果'
                        });
				    	$("#ops-record-update-win").window('close');
				    	$("#addtype-form").form("clear");//清空文本
				    }
				}).submit();
				
			});
			
			//手术项目信息
			$("#opstype-tab").datagrid({
			    url:'init-opreationType',
			    columns:[[
					{field:'operationroom_id',title:'编号',width:100},
					{field:'operationroom_name',title:'手术室',width:180},
					{field:'operationtype_name',title:'手术名称',width:180},
					{field:'operationtype_price',title:'手术金额',width:120}
			    ]],
				onLoadSuccess:function(data){
					var start = 0;
					var end = 0;
					var mer = ['operationroom_id','operationroom_name'];//需要合并的字段，即field
					//有数据就合并----对应数据的数量
					if (data.total > 0){
					    var temp = data.rows[0].operationroom_id;   //需要比较的列-----排班类型----门诊还是住院
					    for (var i = 1; i < data.rows.length; i++) {
						    //第一列的门诊或住院类型=遍历过程中的门诊或住院
							if (temp == data.rows[i].operationroom_id) {
							     end++;
							} else {
							    if (end> start) {
									for(var j = 0; j < mer.length; j ++){
										$("#opstype-tab").datagrid('mergeCells', {
											index: start,//起始索引
											rowspan: end - start + 1,  //需要合并的行数
											field: mer[j]
										});
									}
							   }
							    temp = data.rows[i].operationroom_id;
							    start = i;
							    end = i;
						 }
					 }
					    //这里是为了判断重复内容出现在最后的情况
					    if (end > start) {
							for(var j = 0; j < mer.length; j ++){
								$("#opstype-tab").datagrid('mergeCells', {
									index: start,
									rowspan: end - start + 1,
									field: mer[j]
								});
							}
					    }
					}/* 最大if结束 */
			        
			    }  
			});
		});
			
			
		
			//手术记录信息
			$("#opsing-record").datagrid({
			    url:'init-oprecord',
			    onLoadSuccess: function (data) { 
					if(data==null||data.total ==0){
						$(this).datagrid('appendRow',{
							        op_record_id:'<div style="height:30px;font-size:18px;text-align:center;color:red;line-height:30px;">没有相关记录！</div>',
									rownumbers : false
							//合并单元格
						}).datagrid('mergeCells',{
									index : 0,
									field : 'op_record_id',
									colspan : 10
						})
						//隐藏分页导航条
						$(this).closest('div.datagrid-wrap').find('div.datagrid-pager').hide();
					}else{
						$(this).closest('div.datagrid-wrap').find('div.datagrid-pager').show();
					}
	
				}, 
			    pagination:true,
      		    pageNumber:1,
      		    pageSize:3,
      		    pageList:[3,6],
			    columns:[[
					{field:'op_record_id',title:'记录编号',width:80},
					{field:'clinic_name',title:'病人姓名',width:80},
					{field:'clinic_sex',title:'性别',width:70},
					{field:'user_name',title:'医生名字',width:100},
					{field:'hushiname',title:'医生助手',width:100},
					{field:'operationtype_name',title:'手术类型',width:100},
					{field:'operationroom_name',title:'手术室',width:100},
					{field:'op_record_money',title:'花费金额',width:70},
					{field:'oprecordresult',title:'手术结果',width:60},
					{field:'op_record_begintime',formatter:comFormatDate,title:'开始时间',width:130},
					{field:'op_record_endtime',formatter:comFormatDate,title:'结束时间',width:134}
			    ]]
		});
		


		//初始化手术室
		$('#opretionRoom2').combobox({   
         	url:'init-opreationRoom',//数据源
         	valueField: 'operationroom_id',//实体类名字---主键id
	        textField: 'operationroom_name',//需要显示在下拉框的实际内容
        });
		
		//验证
		$.extend($.fn.textbox.defaults.rules, {
				opsname: {
			        validator: function(value, param) {
			            var reg = /^[\u4e00-\u9fa5]+$/i;
			            return reg.test(value);
			        },
			        message: "项目名称请输入中文"
			    },
			    opsprice:{
			    	validator: function(value, param) {
			            var addressreg = /^[0-9]*$/;
			            return addressreg.test(value);
			        },
			        message: "请输入正确的数字"
			    }
			    
	   });//自定义验证
		
		function comFormatDate(date) {
			var day = new Date(date); 
			var Year = 0; 
			var Month = 0; 
			var Day = 0; 
			var CurrentDate = ""; 
			//初始化时间 
			Year= day.getFullYear();
			Month= day.getMonth()+1; 
			Day = day.getDate(); 
			Hour = day.getHours(); 
			 Minute = day.getMinutes(); 
			 Second = day.getSeconds(); 
			CurrentDate += Year + "-"; 
			if (Month >= 10 ) { 
				CurrentDate += Month + "-"; 
			}else { 
				CurrentDate += "0" + Month + "-"; 
			} 
			if (Day >= 10 ) { 
				CurrentDate += Day ; 
			}else { 
				CurrentDate += "0" + Day ; 
			} 
			if(Hour>=10){
				CurrentDate +=" "+Hour;
			}else{
				CurrentDate +=" "+"0"+Hour;
			}
			if(Minute>=10){
				CurrentDate +=":"+Minute;
			}else{
				CurrentDate +=":"+"0"+Minute;
			}
			if(Second>=10){
				CurrentDate +=":"+Second;
			}else{
				CurrentDate +=":"+"0"+Second;
			}
			return CurrentDate; 
		}
	</script>
	<!-- 手术安排记录 -->
	<fieldset style="border:1px solid #A6A6A6;border-radius:6px;width:1050px;margin: 20px auto;">
    	<legend>手术安排记录</legend>
    	<p>
    	    <a id="lookopstype" class="easyui-linkbutton" style="width:120px;margin-left: 10px;" iconCls="icon-check">查看手术项目</a>
		    <a id="addopstype" class="easyui-linkbutton" style="width:120px;margin-left: 30px;" iconCls="icon-add">新增手术项目</a>
		</p>
    	<div style="padding:6px;margin-top: 10px;">
	    	<table id="ops-record" style="height:400px;" class="easyui-datagrid" data-options="fitColumns:false,singleSelect:false">
			</table>
    	</div>
    </fieldset>
    
    <!-- 手术记录 -->
    <fieldset style="border:1px solid #A6A6A6;border-radius:6px;width:1050px;margin: 20px auto;">
    	<legend>手术记录</legend>
    	<div style="padding:10px;">
	    	<table id="opsing-record" class="easyui-datagrid" style="height:320px;" data-options="fitColumns:false,singleSelect:false">
			</table>
    	</div>
    </fieldset>
    
    <!-- 进行手术的窗口 -->
    <div id="oper-opsing-win" class="easyui-window" title="手术中" style="width:590px;height:450px"
	    data-options="iconCls:'icon-save',closed:true,modal:true,shadow:true,resizable:false,collapsible:false,minimizable:false,maximizable:false">
		<form id="opsing-for" method="post">
			<div style="padding:10px;">
			   <p style="margin-top:30px;font-size:16px;">
				  <a style="margin-left:45px;">
					 <span style="margin-right:7px;">手术安排号</span>
					 <input id="oid" name="operationId" class="easyui-textbox" data-options="" style="width:140px;height:30px;">
				   </a>
				   <a style="margin-left:30px;">
				     <span style="margin-right:7px;">住院号</span>
				     <input id="opshospid" name="hospId" class="easyui-textbox" data-options="required:true" style="width:140px;height:30px;">
				   </a>
				</p>
				<p style="margin-left:45px;margin-top:25px;font-size:16px;">
				   <a>
				     <span style="margin-right:18px;">病人姓名</span>
				     <input id="sname" class="easyui-textbox" data-options="required:true" style="width:140px;height:30px;">
				   </a>
				 	<a style="margin-left:30px;">
				     <span style="margin-right:7px;">手术项目</span>
				     <input id="opsprojectname" class="easyui-textbox" data-options="required:true" style="width:140px;height:30px;">
				   </a>
				 
				 
			    </p>
				<p style="margin-top:30px;font-size:16px;">
					<a style="margin-left:45px;">
					 <span style="margin-right:18px;">记录编号</span>
					 <input id="recordid" name="opRecordId"  value="${recordid }" class="easyui-textbox" data-options="" style="width:140px;height:30px;">
				   </a>
				   <a style="margin-left:30px;">
				     <span style="margin-right:22px;">记录人</span>
					 <input id="rpeople" name="opRecordPeople" value="${user.userName}" class="easyui-textbox" data-options="" style="width:140px;height:30px;">
				   </a>
				  
				</p>
				<p style="margin-left:45px;margin-top:25px;font-size:16px;">
				   <a>
				     <span style="margin-right:7px;">手术总金额</span>
					 <input id="opsmoney_input" name="opRecordMoney" class="easyui-textbox" data-options="required:true" style="width:140px;height:30px;">
				   </a>
				   <a style="margin-left:30px;">
				     <span style="margin-right:7px;">手术结果</span>
					 <input id="opsresult" name="oprecordresult" class="easyui-textbox" data-options="required:true" style="width:140px;height:30px;">
				   </a>
			    </p>
				<p style="margin-left:45px;margin-top:25px;font-size:16px;">
					<a style="margin-top:20px;">
					   <span style="margin-right:18px;">开始时间</span>
						<input id="begtime" class="easyui-datetimebox" name="opRecordBegintime" data-options="required:true,showSeconds:false" value="" style="width:140px;height:30px;">
					</a>
					<a style="margin-left:30px;">
					   <span style="margin-right:7px;">结束时间</span>
					   <input id="oendtime" class="easyui-datetimebox" name="opRecordEndtime" data-options="required:true,showSeconds:false" value="" style="width:140px;height:30px;">
					</a>
				</p>
				<p style="margin-left:40%;margin-top: 60px;">
				  <a id="opsing-comfirm" class="easyui-linkbutton" iconCls="icon-add" style="width:100px;">确定</a>
				</p>
	
	    	</div>
		</form>
		
	</div>
	
	<!-- 新增手术项目 -->
	 <div id="ops-record-update-win" class="easyui-window" title="新增手术项目" style="width:320px;height:320px"
	    data-options="iconCls:'icon-save',closed:true,modal:true,shadow:true,resizable:false,collapsible:false,minimizable:false,maximizable:false">
		<form id="addtype-form" method="post" style="padding:10px;">
	    	<p style="margin-top:20px;font-size:16px;">
				<a style="margin-left:30px;">
				 <span style="margin-right:7px;">手术名称</span>
				 <input id="arr-update-id" class="easyui-textbox" name="operationtypeName"  data-options="required:true,validType:['opsname']" style="width:140px;height:30px;">
			   </a>
			</p>
			<p style="margin-top:30px;font-size:16px;">
			  <a style="margin-left:30px;">
			      <span style="margin-right:7px;">手术类型</span>
			      <select id="opretionRoom2" name="operationroomId"  class="easyui-combobox" data-options="" style="width:140px;height:30px;">
				  </select>	
			   </a>
			</p>
			<p style="margin-top:30px;font-size:16px;">
				<a style="margin-left:30px;">
				 <span style="margin-right:7px;">手术金额</span>
				 <input id="arr-update-opsroom" name="operationroomPrice" class="easyui-textbox" style="margin-left: 15px;width:140px;height:30px;" data-options="required:true,validType:['opsprice']">
			   </a>
			</p>
			<p style="margin-left:40%;margin-top: 20px;">
			  <a id="addtype-comfrim" class="easyui-linkbutton" iconCls="icon-add" style="">确定</a>
			</p>
    	</form>
	</div>
	
	<div id="opstype-win" class="easyui-window" title="手术项目" style="width:600px;height:500px"
	    data-options="iconCls:'icon-save',closed:true,modal:true,shadow:true,resizable:false,collapsible:false,minimizable:false,maximizable:false">
		<table id="opstype-tab" class="easyui-datagrid" style="" data-options="fitColumns:false,singleSelect:false">
	    </table>
	</div>
	
	<!-- 弹框提示 -->
    <div id="warmingaddtype-win" class="easyui-window"  title="提示框" style="width:300px;height:156px"
    data-options="iconCls:'icon-save',modal:true,resizable:false,collapsible:false,maximizable:false,minimizable:false,closed:true">
          <p class="window-type" style=" margin-left: 72px;font-size: 16px;margin-top: 47px;">
          </p>
    </div> 
</body>
</html>